{include file="poster/common" /}
<form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
    <div class="tab-pane active" id="tab_design">
        <div class="form-group">
            <div class="col-sm-12">
                <table style="width:100%;">
                    <tbody>
                    <tr>
                        <td style="width:320px;padding:10px;" valign="top">
                            <div id="poster">
                                <img src='{$row.bg_image|htmlentities}' class='bg'/>
                                {if !empty($row['data'])}
                                {foreach name="row.data" item="d"}
                                <div class="drag" type="{$d['type']}" index="{++$key}" style="zindex:{$key};left:{$d['left']};top:{$d['top']};width:{$d['width']};height:{$d['height']}" src="{$d['src']|default=''}" size="{$d['size']|default='15px'}" color="{$d['color']|default='#000'}" qr_text="{$d['qr_text']|default=''}" qr_table="{$d['qr_table']|default=''}" qr_field="{$d['qr_field']|default=''}" qr_relation="{$d['qr_relation']|default=''}">
                                    {if $d['type']=='qr'}
                                    <img src="/assets/addons/poster/images/qr.jpg" />
                                    {elseif $d['type']=='head'}
                                    <img src="/assets/addons/poster/images/head.jpg" />
                                    {elseif $d['type']=='img'}
                                    {if empty($d['src'])}
                                    <img src="/assets/addons/poster/images/img.jpg" />
                                    {else}
                                    <img src="{$d['src']}" />
                                    {/if}
                                    {elseif $d['type']=='nickname'}
                                    <div class="text" style="font-size:{$d.size|default='15px'};color:{$d.color|default='#000'}">会员昵称</div>
                                    {/if}
                                    <div class="rRightDown"></div>
                                    <div class="rLeftDown"></div>
                                    <div class="rRightUp"></div>
                                    <div class="rLeftUp"></div>
                                    <div class="rRight"></div>
                                    <div class="rLeft"></div>
                                    <div class="rUp"></div>
                                    <div class="rDown"></div>
                                </div>
                                {/foreach}
                                {/if}
                            </div>
                        </td>
                        <td valign="top" style="padding:10px;">
                            <div class="panel panel-default">
                                <div class="panel-body">
                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-3">{:__('Title')}:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <input id="c-title" data-rule="required" class="form-control" name="row[title]" type="text" placeholder="此项必须填写" value="{$row.title|htmlentities}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-3">{:__('Waittext')}:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <input id="c-waittext" class="form-control" name="row[waittext]" type="text" placeholder="例如：您的专属海报正在拼命生成中，请等待片刻..." value="{$row.waittext|htmlentities}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-3">{:__('Status')}:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <div class="radio">
                                                {foreach name="statusList" item="vo"}
                                                <label for="row[status]-{$key}"><input id="row[status]-{$key}" name="row[status]" type="radio" value="{$key}" {in name="key" value="$row.status"}checked{/in} /> {$vo}</label>
                                                {/foreach}
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="c-weigh" class="control-label col-xs-12 col-sm-3">{:__('Weigh')}:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <input id="c-weigh" class="form-control" name="row[weigh]" type="number" value="{$row.weigh}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-3">{:__('Bg_image')}:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <div class="input-group">
                                                <input id="c-bg_image" class="form-control" size="50" name="row[bg_image]" type="text" value="{$row.bg_image|htmlentities}">
                                                <div class="input-group-addon no-border no-padding">
                                                    <span><button type="button" id="plupload-bg_image" class="btn btn-danger plupload" data-input-id="c-bg_image" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" data-multiple="false" data-preview-id="p-bg_image"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                                    <span><button type="button" id="fachoose-bg_image" class="btn btn-primary fachoose" data-input-id="c-bg_image" data-mimetype="image/*" data-multiple="false"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                                                </div>
                                                <span class="msg-box n-right" for="c-bg_image"></span>
                                            </div>
                                            <ul class="row list-inline plupload-preview" id="p-bg_image"></ul>
                                        </div>
                                        <label class="control-label col-xs-12 col-sm-3"></label>
                                        <div class="col-xs-12 col-sm-8">
                                            <span class="help-block">背景图片尺寸: 640 * 1008</span>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-3">{:__('Poster elements')}:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <button class="btn btn-default btn-com" type="button" data-type="head">头像</button>
                                            <button class="btn btn-default btn-com" type="button" data-type="nickname">昵称</button>
                                            <button class="btn btn-default btn-com" type="button" data-type="qr">二维码</button>
                                            <button class="btn btn-default btn-com" type="button" data-type="img">图片</button>
                                        </div>
                                        <label class="control-label col-xs-12 col-sm-3"></label>
                                        <div class="col-xs-12 col-sm-8">
                                            <span class="help-block">提示：鼠标可拖拽海报中的元素，右键可显示操作菜单。</span>
                                        </div>
                                    </div>

                                    <div class="form-group nameset" style='display:none'>
                                        <label class="control-label col-xs-12 col-sm-3">{:__('Nickname color')}:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <div class="row">
                                                <div class="col-sm-8 col-xs-12">
                                                    <input id="c-color" data-rule="required" class="form-control" name="color" type="text" value="" style="width: 50%">
                                                    <span class="input-group-btn" style="display: unset;">
                                                    <button type="button" class="btn btn-default btn-color colorpicker" style="padding:0;margin-left:1px;" title="选择颜色"><img src="__CDN__/assets/addons/poster/images/colorful.png" height="29" alt=""></button>
                                                    <span class="msg-box n-right" for="c-color"></span>
                                                </div>
                                                <div class="col-sm-4"></div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="form-group nameset" style='display:none'>
                                        <label class="control-label col-xs-12 col-sm-3">{:__('Nickname size')}:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <input type="text" id="namesize" data-rule="required" class="form-control namesize" placeholder="例如: 14,16" style="width: 90%;"/>
                                            <div class="input-group-addon" style="display: contents;">px</div>
                                        </div>
                                    </div>

                                    <div class="qrset" style='display:none'>
                                        <div class="form-group">
                                            <label class="control-label col-xs-12 col-sm-3">{:__('二维码内容')}:</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <div class="radio">
                                                    <label for="row[qr_type]-0">
                                                        <input id="row[qr_type]-0" class="qr_type" name="row[qr_type]" type="radio" value="0" {in name="0" value="$row.qr_type"}checked{/in}/> 自定义生成
                                                    </label>
                                                    <label for="row[qr_type]-1">
                                                        <input id="row[qr_type]-1" class="qr_type" name="row[qr_type]" type="radio" value="1" {in name="1" value="$row.qr_type"}checked{/in}/> 数据表图片
                                                    </label>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-group qrset0" {in name="1" value="$row.qr_type"}style='display:none'{/in}>
                                            <label class="control-label col-xs-12 col-sm-3">{:__('自定义内容')}:</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input id="c-qr_text" data-rule="required" class="form-control" name="qr_text" type="text" placeholder="如：https://www.example.com?parent_id={id}" value="">
                                            </div>
                                            <label class="control-label col-xs-12 col-sm-3"></label>
                                            <div class="col-xs-12 col-sm-8">
                                                <span class="help-block">嵌入user表中的字段生成时动态替换，如：{id}、{mobile}等。</span>
                                            </div>
                                        </div>

                                        <div class="qrset1" {in name="0" value="$row.qr_type"}style='display:none'{/in}>
                                            <div class="form-group">
                                                <label class="control-label col-xs-12 col-sm-3">{:__('Qr_table')}:</label>
                                                <div class="col-xs-12 col-sm-8">
                                                    {:build_select('qr_table',$tableList,null,['class'=>'form-control selectpicker']);}
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="control-label col-xs-12 col-sm-3">{:__('Qr_field')}:</label>
                                                <div class="col-xs-12 col-sm-8">
                                                    <select id="c-qr_field" data-rule="required" style="height:30px;" class="form-control selectpicker"></select>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="control-label col-xs-12 col-sm-3">{:__('Qr_relation')}:</label>
                                                <div class="col-xs-12 col-sm-8">
                                                    <select id="c-qr_relation" data-rule="required" style="height:30px;" class="form-control selectpicker"></select>
                                                </div>
                                                <label class="control-label col-xs-12 col-sm-3"></label>
                                                <div class="col-xs-12 col-sm-8">
                                                    <span class="help-block">选择存放二维码图片路径的数据表和字段</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="form-group imgset" style='display:none'>
                                        <label class="control-label col-xs-12 col-sm-3">{:__('Graphics Settings')}:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <div class="input-group">
                                                <input id="c-img" data-rule="required" class="form-control" size="50" name="img" type="text" value="">
                                                <div class="input-group-addon no-border no-padding">
                                                    <span><button type="button" id="plupload-img" class="btn btn-danger plupload" data-input-id="c-img" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" data-multiple="false" data-preview-id="p-img"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                                    <span><button type="button" id="fachoose-img" class="btn btn-primary fachoose" data-input-id="c-img" data-mimetype="image/*" data-multiple="false"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                                                </div>
                                                <span class="msg-box n-right" for="c-img"></span>
                                            </div>
                                            <ul class="row list-inline plupload-preview" id="p-img"></ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <input type="hidden" name="row[data]" value="" />
            <button type="submit" class="btn btn-success btn-embossed disabled">{:__('OK')}</button>
            <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
        </div>
    </div>
</form>
